<!-- 查价 -->
<template>
  <div class="mainTable tablePage">
    <div class="search">
      <div class="header-query">
        <span class="search-text">到手价</span>
        <el-input clearable v-model="query.goodActualPrice" placeholder="请输入到手价" class="search-input" @keyup.native.enter="getTableData()"></el-input>
      </div>
      <div class="header-query">
        <span class="search-text">查价条件</span>
        <el-input clearable v-model="query.productBarCodeAndProductNum" placeholder="产品条码:包数" class="search-input" @keyup.native.enter="getTableData()"></el-input>
      </div>

      <div class="search-btn" @click="getTableData()" v-if="Btn.search">
        <div class="btn-img"></div>查询
      </div>
      <div class="add-btn" @click="handleClick(null, 'add')" v-if="Btn.add" v-show="btnPermissionSearch('basicData', 'fileManage', 'add')">
        <div class="btn-img"></div>新增
      </div>
      <!-- <div class="export-btn" @click="handleClick(null, 'export')" v-if="Btn.export" v-loading="exportLoading">
        <div class="btn-img"></div>
        {{ !exportLoading ? "导出" : "导出中" }}
      </div> -->
      <div class="deletes-btn" @click="handleClick(null, 'deletes')" v-if="Btn.deletes" v-show="btnPermissionSearch('basicData', 'fileManage', 'deletes')">
        批量删除
      </div>
    </div>
    <div style="display:flex;height:calc(100% - 7.2rem)">
      <BaseTable ref="table1" :tableAllData="data1" :tableItems="tableItems" style="width:50%;margin-right:1rem" :optionList="optionList" :methodParam="methodParam" :Btn="Btn" menuName="logRecord" pageName="mainTable" />
      <BaseTable ref="table2" :tableAllData="data2" :tableItems="tableItems2" style="width:50%" :optionList="optionList" :methodParam="methodParam" :Btn="Btn" menuName="logRecord" pageName="mainTable" />
    </div>
  </div>
</template>
<script>
import dayjs from "dayjs"
import BaseTable from "@/components/table/cjTable.vue";
import { service } from "@/services/backServices"
export default {
  name: "cj",
  data() {
    return {
      //后端人员修改-S
      //查询参数
      query: {
        goodActualPrice: "",
        // productBarCodeAndProductNum: "69346287438:1;69346287438:2;69346287438:21;69346287438;1:69346287438:6",
        productBarCodeAndProductNum: "",
      },
      //   [
      //     { prop: "goodActualPrice", type: "input", placeholder: "", value: "0", name: "到手价" },
      //     { prop: "productBarCodeAndProductNum", type: "input", placeholder: "产品编码:包数", value: "69346287438:1;69346287438:2;69346287438:2;69346287438:1;69346287438:6", name: "筛选条件" },
      //   ],
      //表格表头
      tableItems: [
        { name: "产品条码", prop: "产品条码"  },
        { name: "产品名称", prop: "产品名称"  },
        { name: "包数", prop: "包数"  },
        { name: "单包片数", prop: "单包片数"  },
        { name: "总片数", prop: "总片数"  },
        { name: "单包赠品成本", prop: "单包赠品成本"  },
        { name: "总赠品成本", prop: "总赠品成本"  },
        { name: "单包开单", prop: "单包开单"  },
        { name: "总开单", prop: "总开单"  },
        { name: "单包零售价", prop: "单包零售价"  },
        { name: "总零售价", prop: "总零售价" },
        { name: "单包日促底价", prop: "单包日促底价"  },
        { name: "总日促底价", prop: "总日促底价"  },
        { name: "单包大促底价", prop: "单包大促底价"  },
        { name: "总大促底价", prop: "总大促底价"  }
      ],
      //表格表头
      tableItems2: [
        { name: "到手价", prop: "到手价"  },
        { name: "总包数合计", prop: "总包数合计"  },
        { name: "总大促底价合计", prop: "总大促底价合计"  },
        { name: "总开单合计", prop: "总开单合计"  },
        { name: "总日促底价合计", prop: "总日促底价合计"  },
        { name: "总片数合计", prop: "总片数合计"  },
        { name: "总赠品成本合计", prop: "总赠品成本合计"  },
        { name: "折扣费率", prop: "折扣费率"  },
        { name: "是否破大促价", prop: "是否破大促价"  },
        { name: "是否破日促价", prop: "是否破日促价"  },
        { name: "片单价", prop: "片单价"  },
        { name: "赠品占比", prop: "赠品占比"  }
      ],
      //增删查改的对象属性
      updateItems: [//edit是回复
        { name: "文件名称", prop: "fileName", type: "input", disabled: true },
        { name: "上传类型", prop: "uploadType", type: "select" },
        { name: "备注", prop: "remark", type: "textarea" },
        { name: "上传文件", prop: "fileAdd", type: "upload" },
      ],
      //增删查改的对象属性的下拉select或者级联cascader
      optionList: {
        unit: [
          {label: "日", value: "日" },
          {label: "周", value: "周" },
          {label: "月", value: "月" },
          {label: "年", value: "年" },
        ]
      },
      //增删查改方法参数
      methodParam: "checkPriceExe",
      //自定义btn功能
      Btn: {
        search: true, //查询按钮
        add: false, //添加按钮
        edit: false, //回复按钮
        detail: false, //详情按钮
        delete: false, //删除按钮
        deletes: false, //批量删除按钮
        export: true, //导出按钮
        templateDownload: false, //模板下载按钮
        upload: false, //上传按钮
      },
      //后端人员修改-E
      exportLoading: false,
      data1: [],
      data2: []
    };
  },
  components: {
    BaseTable
  },
  created() {
    let _this = this
  },
  mounted() {
    //this.getTableData();
  },
  methods: {
    getTableData() {
      let data = new FormData()
      for (let key in this.query) {
        data.append(key, this.query[key])
      }
      service({
        url: "checkPriceExe",
        method: "post",
        data: data
      }).then(res => {
        if (res.data.code == 200) {
          this.data1 = res.data.data[0]
          this.data2 = res.data.data[1]
        }
      })
    }
  }
};
</script>
<style scoped lang="less">
.mainTable {
  background-color: #f1f2f9;

  .search {
    background-color: #fff;
  }

  .tablePage {
    border-left: 0;
    border-right: 0;
    border-bottom: 0;

    ::v-deep {
      .base-table {
        top: 20px;
        padding: 0 20px;
      }
    }
  }
}
</style>
  